import { useInfoModal } from "@/app/utils/hooks/useInfoModal";
import { useRouter } from "next/navigation";
import { BsFillPlayFill } from "react-icons/bs";

interface PlayButtonProps {
    movieId: number;
}

export const PlayButton = ({ movieId }: PlayButtonProps) => {
    const router = useRouter()
    const { closeModal } = useInfoModal()

    const toPage = () => {
        closeModal()
        router.push(`/watch/${movieId}`)
    }

    return (<>
        <button onClick={toPage} className="bg-white rounded-md py-1 text-black md:py-2 px-2 md:px-4 w-auto text-sx md:text-lg font-semibold flex flex-row items-center hover:bg-neutral-300 transition">
            <BsFillPlayFill size={25} className="mr-1" />
            Play
        </button>
    </>)
}